import React, { Component } from 'react'
import '../../assets/css/register.css'
import { message } from 'antd';
import { register1 } from '../../request/api'
export default class register extends Component {
    constructor() {
        super()
        this.state = {
            user: {
                nickname: '',
                phone: '',
                password: ''
            }
        }
    }
    change(e, type) {
        this.setState({
            user: {
                ...this.state.user,
                [type]: e.target.value
            }
        })
    }
    register() {
        if (this.state.user.phone != "" && this.state.user.password != "" && this.state.user.nickname != "") {
            register1(this.state.user).then(res => {
                if (res.code == 200) {
                    message.success('注册成功');
                    this.props.history.push('/login')
                }

            })
        } else {
            message.info('请填写完整');
        }


    }
    render() {
        return (
            <div className='register'>
                <div className='register-top'><i onClick={() => this.props.history.goBack()}>&lt;</i> 手机注册<span className='register1' onClick={()=>this.props.history.push('/login')}>登录</span></div>
                <img src="/img/log.png" alt="" />
                <div className='cont'>
                    <label htmlFor="">手机号</label> <input type="text" name="" id="" value={this.state.user.phone} onChange={(e) => this.change(e, 'phone')} /><br />
                    <label htmlFor="">昵&nbsp; 称</label><input type="text" name="" id="" value={this.state.user.nickname} onChange={(e) => this.change(e, 'nickname')} /><br />
                    <label htmlFor="">密 &nbsp;码</label><input type="password" name="" id="" value={this.state.user.password} onChange={(e) => this.change(e, 'password')} /><br />
                    <button onClick={() => this.register()}>注册</button>
                </div>
            </div>
        )
    }

}
